import Chart from 't/common/chart';
import useMappingProps from 't/common/hooks/useMappingProps';
import { commonProps, createNameSpace } from 't/common/utils';
import { defineComponent, onMounted, ref } from 'vue';
import styles from './index.module.scss';
import './index.scss';


export default defineComponent({
  name: createNameSpace('chart-strip'),
  props: {
    ...commonProps,
    ...Chart.props,
    option: {
      type: Object,
      default() {
        return null;
      },
    },
    data: {
      type: Array,
      default() {
        return null;
      },
    },
  },
  emits: [],

  setup(props, { attrs, emit, expose, slots }) {
        const getCaption = (caption, value) => {
          if (value && window.Funcs) {
            debugger;
            return Funcs.GetTerms(value, caption);
          } else {
            debugger;
            return caption;
          }
        };

    const refComponent = ref();
    const [mappingProps, mappingExpose] = useMappingProps(props);
    const newoption = mappingProps.option;
    expose(mappingExpose);

    onMounted(() => {});

    function onClickHandler(params) { }
        newoption.title.text = getCaption(
          newoption.title.text,
          newoption.title.ValueInfo_text,
        );

        for (var i = 0; i < newoption.series.length; i++) {
          newoption.series[i].name = getCaption(
            newoption.series[i].name,
            newoption.series[i].ValueInfo_name,
          );
        }


    return () => {
      return (
        <Chart
          {...attrs}
          class={styles.module}
          option={newoption}
          data={mappingProps.data}
          v-show={mappingProps.visible}
          visible={mappingProps.visible}
        ></Chart>
      );
    };
  },
});
